/* ----------------------- CREDITS & NOTES ---------------------- */
/*                                                                */
/* Name:         Bloggerish - for personal journals               */
/* Description:  Custom CSS style for Bloggish layout that mocks  */
/*               the Blogger dashboard (see: blogger.com)         */
/* Categories:   S2, Bloggish, One Column, Two Columns,           */
/*               Three Columns, Imageless, Colors: Palette,       */
/*               No Banner, No Entry Icon, Custom Mini Icons,     */
/*               Cross-Browser Support, Bidirectionality Support  */
/* Author:       Ally (see: wastintime.insanejournal.com)         */
/* Requirements: Firefox 3.6+, Chrome, Safari, Opera, or IE8+     */
/* Instructions: These instructions are for Insanejournal and     */
/*               will be different for other sites                */
/*               - Must be in Style System 2 (S2)                 */
/*               - Set layout to Bloggish                         */
/*               - Set theme to None                              */
/*               - Choose "Layout Type" (any of them will work)   */
/*               - Set "Link text to read comments" (optional)    */
/*               - Set "Use Layout Base Style" to No              */
/*               - Set "Use External Stylesheet" to No            */
/*               - Paste this code into "Custom Stylesheet" box   */
/*               - Add any additional styling AFTER this code     */
/*               - If you add code, be sure to credit yourself!   */
/*               - Hit "Save Changes" and view your journal       */
/*               - Congrats on your new style!                    */
/*                                                                */
/* -------------------------------------------------------------- */

/* ------------------------- BEGIN CODE ------------------------- */

/*                  === Cross-Browser Support ===                 */
/*        Internet Explorer initialization for all elements       */
/*                       !! DO NOT REMOVE !!                      */
*  {
	zoom: 1;
	position: relative;
	margin: 0;
	padding: 0;
}

/*           === Defaults: All Layout Configurations ===          */
/*    Sets up a base stylesheet for all layout configurations     */
/*             Edit the colors and fonts - All users              */
/*   Edit the spacing and positioning - Advanced CSS users only   */

/*                   ==== Non-Specfic View ====                   */
/* Default styling for all views (recent, archive, friends, tag)  */

body  {
	background: rgb(125, 125, 135);
	z-index: 0;
}

a {
	text-decoration: none;
}

.pkg {
	display: block;
}

.pkg::after {
	content: " ";
	display: block;
	visibility: hidden;
	clear: both;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
}

#container {
	z-index: 2;
	position: static;
	width: 760px;
	margin: 0 auto;
	background: rgb(0, 0, 0);
	-moz-box-shadow: 2px 0 2px rgba(0, 0, 0, 0.5), -2px 0 2px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 2px 0 2px rgba(0, 0, 0, 0.5), -2px 0 2px rgba(0, 0, 0, 0.5);
	box-shadow: 2px 0 2px rgba(0, 0, 0, 0.5), -2px 0 2px rgba(0, 0, 0, 0.5);

	filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=2,MakeShadow=true,ShadowOpacity=0.30);
	-ms-filter: "progid:DXImageTransform.Microsoft.Blur(PixelRadius=2,MakeShadow=true,ShadowOpacity=0.30)";
}

#container-inner {
	width: 100%;
	z-index: 3;
	background: rgb(255, 255, 255);
}

.module-calendar .module-content, .module-typelist .module-content, .module-categories .module-content, .module-pagesummary .module-content, .module-syndicate .module-content {
	display: none;
	transition: height 2s;
    -moz-transition: height 2s;
    -webkit-transition: height 2s;
    -o-transition: height 2s;
}

.module-powered { display: none; }

.module-calendar h2.module-header:hover  + .module-content, .module-typelist h2.module-header:hover  + .module-content, .module-categories h2.module-header:hover  + .module-content, .module-pagesummary h2.module-header:hover  + .module-content, .module-syndicate h2.module-header:hover  + .module-content {
	display: block;
}

.module-calendar div.module-content:hover, .module-typelist div.module-content:hover, .module-categories div.module-content:hover, .module-pagesummary div.module-content:hover, .module-syndicate div.module-content:hover {
	display: block;
}

h2.module-header {
	display: block;
	font-size: 12px;
	font-weight: normal;
	color: rgb(255, 255, 255);
	background: rgba(125, 125, 125, 0.5);
	padding: 5px;
	border: 1px solid rgba(125, 125, 125, 0.3);
	margin: 5px 0;
}

h2.module-header:hover {
	color: rgb(65, 65, 65);
	background: rgba(125, 125, 125, 0.3);
	border: 1px solid rgba(125, 125, 125, 0.5);
}

.module-list {
	list-style: none;
}

.module-list-item::before {
	content: "\2730";
	color: rgb(125, 125, 125);
}

.module-calendar h2.module-header  {
	font-size: 0;
	word-spacing: -3px;
	letter-spacing: 0;
}

.module-calendar h2.module-header::after  {
	font-size: 12px;
	word-spacing: 0;
	content: "Post Calendar";
}

.module-photo .module-content {
	text-align: center;
}

.module-viewlinks  {
	position: absolute;
	left: 561px;
	top: -100px;
	width: 400px;
	z-index: -1;
	transform:rotate(-90deg);
	-ms-transform:rotate(-90deg); /* IE 9 */
	-moz-transform:rotate(-90deg); /* Firefox */
	-webkit-transform:rotate(-90deg); /* Safari and Chrome */
	-o-transform:rotate(-90deg); /* Opera */
}

.module-viewlinks .module-list  {
	list-style: none;
}

.module-viewlinks .module-list .module-list-item  {
	display: inline-block;
	padding: 5px;
	margin: 0 5px;
	background: rgba(255, 255, 255, 0.5);
	border-width: 0 2px 2px 2px;
	border-style: solid;
	border-color: rgba(255, 255, 255, 0.3);
	-moz-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5), -2px 0 2px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5), -2px 0 2px rgba(0, 0, 0, 0.5);
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5), -2px 0 2px rgba(0, 0, 0, 0.5);

	filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=2,MakeShadow=true,ShadowOpacity=0.30);
	-ms-filter: "progid:DXImageTransform.Microsoft.Blur(PixelRadius=2,MakeShadow=true,ShadowOpacity=0.30)";
}

#banner {
	background: transparent url(http://i471.photobucket.com/albums/rr74/Graclessally/krisheader.png) no-repeat 0 0;
	width: 100%;
	height: 200px;
}

#pagebody, #pagebody-inner { width: 100%; }

#pagebody { position: static; }

#alpha, #beta, #gamma { float: left; margin: 2%; position: static; }

#alpha-inner, #beta-inner, #gamma-inner { width: 100%; }

/*                   ==== Recent/Tag View ====                    */
/*            Additional styling for recent and tag view          */

/*        ==== Archive, Year, Month, and Day Views ====           */
/*  Additional styling for archive, year, month, and day views    */

/*                    ==== Friends View ====                      */
/*               Additional styling for friends view              */

/*                   === Defaults: One Column ===                 */
/*   Sets the page column widths for a one column configuration   */

.layout-one-column #container #container-inner #pagebody #pagebody-inner #alpha { width: 96%; }

/*        === Defaults: Two Column (Sidebar on Left) ===          */
/*   Sets the page column widths for a two column configuration   */
/*   with the sidebar on the left-hand side                       */

.layout-two-column-left #container #container-inner #pagebody #pagebody-inner #alpha  { width: 16%; }

.layout-two-column-left #container #container-inner #pagebody #pagebody-inner #beta { width: 76%; }

/*       === Defaults: Two Column (Sidebar on Right) ===          */
/*   Sets the page column widths for a two column configuration   */
/*   with the sidebar on the right-hand side                      */

.layout-two-column-right #container #container-inner #pagebody #pagebody-inner #alpha { width: 76%; }

.layout-two-column-right #container #container-inner #pagebody #pagebody-inner #beta { width: 16%; }

/*                === Defaults: Three Column ===                  */
/*  Sets the page column widths for a three column configuration  */

.layout-three-column #container #container-inner #pagebody #pagebody-inner #alpha { width: 16%; }

.layout-three-column #container #container-inner #pagebody #pagebody-inner #beta { width: 56%; }

.layout-three-column #container #container-inner #pagebody #pagebody-inner #gamma { width: 16%; }

/* -------------------------- END CODE -------------------------- */
/*           Put any additional styling after this line           */